<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div>
  <h2>{{weibo.nick}}:{{weibo.content}}</h2>
    <div>发布于:{{weibo.created}}</div>
  <img v-for="url in weibo.urlArr" :src="url" style="width: 200px;height: 200px" alt="">
    <hr>
    <h2>评论相关</h2>
    <form action="">
        <input type="text" name="comment" v-model="comment.content" placeholder="说点什么吧">
        <input type="button" value="评论" @click="send()">
    </form>
    <div v-for="c in commArr">
        <p>{{c.nick}}:{{c.content}}</p>
    </div>
</div>
<script src="js/vue.min.js"></script>
<script src="js/axios.min.js"></script>
<script>
  let v = new Vue({
    el:"body>div",
    data:{
      weibo:{},
        comment:{
          content:"",
            weiboId:"",
        },
        commArr:[],
    },
    created:function (){
      let id = location.search.split("=")[1];
      axios.get("/selectByWeiboId?id="+id).then(function (response){
          v.weibo = response.data;
          v.weibo.urlArr = v.weibo.urls==""?[]:v.weibo.urls.split(",");
      });
      axios.get("/comment/selectByWeiboId?id="+id).then(function (response){
          v.commArr = response.data;
      })
    },
      methods:{

          send(){
              v.comment.weiboId = v.weibo.id;
              axios.post("/comment/insert",v.comment).then(function (response){
                  if(response.data==1){
                      alert("评论成功");
                      location.reload();
                  }else{
                      alert("请先登录")
                      location.href="/login.html";
                  }
              })
          }
      }
  })
</script>
</body>
</html>